<template>
  <div class="single_column">
    <div
      v-for="(item, index) in layer.children"
      :key="index"
      class="single_column_item"
    >
      <BaseComponent
        :tasksConfig="tasksConfig"
        :layer="item"
        :nodeId="nodeId"
      ></BaseComponent>
    </div>
    <BaseBottomButtons
      v-if="layer.data.buttons"
      :tasksConfig="tasksConfig"
      :layer="layer"
      :nodeId="nodeId"
    ></BaseBottomButtons>
  </div>
</template>
<script>
export default {
  components: {
    BaseComponent: () =>
      import(
        /* webpackChunkName:'baseComponent' */ "./components/baseComponent.vue"
      ),
    BaseBottomButtons: () =>
      import(
        /* webpackChunkName:'baseBottomButtons' */ "./components/baseBottomButtons.vue"
      ),
  },
  props: {
    nodeId: {
      type: String,
      default() {
        return "Home";
      },
    },
    tasksConfig: {
      type: Object,
      default() {
        return {};
      },
    },
    layer: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {};
  },
  created() {},
};
</script>
<style lang="less"></style>
